<html>
<head>
	<meta http-equiv="content-type" content="text/html;charset=utf-8">
	<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<style>
        table,table tr th, table tr td {border:1px solid black; }
        table {width: 200px; min-height: 25px; line-height: 25px; text-align: center; border-collapse: collapse;font-size:14px;}
		input {min-height: 25px; line-height: 25px; border:0;text-align:center;}
		.title {background:#CCC;}
</style>
<!--
	function:点击“合计”的输入框，通过公式自动计算值并显示
	author:peter
	date:2017-05-18
	version:1.0
-->
<body>
	<table>
		<tr class="title">
			<td>基数</td>
			<td>天数</td>
			<td>利率%</td>
			<td>合计</td>
		</tr>		
		<tr class="content">
			<td><input type="text" class="base" value='20000'></td>
			<td><input type="text" class="days" value='100'></td>
			<td><input type="text" class="rate" value='0'></td>
			<td><input type="text" class="sum" value='0'></td>
		</tr>
	</table>
</body>
</html>
<script type="text/javascript">
	$(".sum").click(function(){
		var base = parseFloat(jQuery(".base").val());
		var days = parseInt(jQuery(".days").val());
		var rate = parseFloat(jQuery(".rate").val())/100;
		var year_days = 360;  // 年天数
		var sum = base*days*rate/year_days;
		if(isNaN(sum)){
			alert("输入的参数不合法，请检查并重新输入！");
			$(".sum").val('');
		}else{
			$(".sum").val(sum.toFixed(2));
		}
	});
</script>	